<script lang="ts" setup>
import { ref, onMounted } from "vue";
import SubMenu from "./sub-menu.vue";
import { useRoute } from "vue-router";
const route = useRoute();
const defaultActive = ref<any>("home");
onMounted(() => {
  defaultActive.value = route.name;
});
const MenuList = ref([
  {
    redirect: null,
    path: "/home",
    component: "index",
    route: "1",
    children: [],
    meta: {
      keepAlive: false,
      internalOrExternal: false,
      icon: "console-sql-outlined",
      componentName: "index",
      title: "首页",
    },
    name: "Home",
    id: "1743546710116077569",
  },
  {
    redirect: null,
    path: "/getSample1st",
    component: "index",
    route: "1",
    children: [
      {
        path: "/samplingTask",
        component: "layouts/RouteView",
        route: "1",
        children: [],
        meta: {
          keepAlive: false,
          internalOrExternal: false,
          componentName: "RouteView",
          title: "用户管理",
        },
        name: "UserManagement",
        id: "1717408603080736769",
      },
      {
        path: "/samplingTask",
        component: "layouts/RouteView",
        route: "1",
        children: [],
        meta: {
          keepAlive: false,
          internalOrExternal: false,
          componentName: "RouteView",
          title: "新闻栏目管理",
        },
        name: "NewsColumnManagement",
        id: "171740860308073676111",
      },
      {
        path: "/samplingTask",
        component: "layouts/RouteView",
        route: "1",
        children: [],
        meta: {
          keepAlive: false,
          internalOrExternal: false,
          componentName: "RouteView",
          title: "新闻资讯管理",
        },
        name: "NewsInformationManagement",
        id: "171740860308073676111",
      },
    ],
    meta: {
      keepAlive: false,
      internalOrExternal: false,
      icon: "barcode-outlined",
      componentName: "index",
      title: "内容管理",
    },
    name: "User",
    id: "1717402338568945665",
  },
  {
    redirect: null,
    path: "/getSample1st",
    component: "index",
    route: "1",
    children: [],
    meta: {
      keepAlive: false,
      internalOrExternal: false,
      icon: "barcode-outlined",
      componentName: "index",
      title: "问题留言解答",
    },
    name: "MessageManagement",
    id: "1717402338568945665",
  },
  {
    redirect: null,
    path: "/getSample1st",
    component: "index",
    route: "1",
    children: [],
    meta: {
      keepAlive: false,
      internalOrExternal: false,
      icon: "barcode-outlined",
      componentName: "index",
      title: "规则配置",
    },
    name: "RuleConfiguration",
    id: "1717402338568945665",
  },
  {
    redirect: null,
    path: "/getSample1st",
    component: "index",
    route: "1",
    children: [],
    meta: {
      keepAlive: false,
      internalOrExternal: false,
      icon: "barcode-outlined",
      componentName: "index",
      title: "委托协议模版管理",
    },
    name: "TemplateManagement",
    id: "1717402338568945665",
  },
  {
    redirect: null,
    path: "/getSample1st",
    component: "index",
    route: "1",
    children: [
      {
        path: "/samplingTask",
        component: "layouts/RouteView",
        route: "1",
        children: [],
        meta: {
          keepAlive: false,
          internalOrExternal: false,
          componentName: "RouteView",
          title: "投诉受理",
        },
        name: "ComplaintAcceptance",
        id: "1717408603080736769",
      },
      {
        path: "/samplingTask",
        component: "layouts/RouteView",
        route: "1",
        children: [],
        meta: {
          keepAlive: false,
          internalOrExternal: false,
          componentName: "RouteView",
          title: "投诉办理",
        },
        name: "ComplaintHandling",
        id: "171740860308073676111",
      },
      {
        path: "/samplingTask",
        component: "layouts/RouteView",
        route: "1",
        children: [],
        meta: {
          keepAlive: false,
          internalOrExternal: false,
          componentName: "RouteView",
          title: "投诉预警",
        },
        name: "ComplaintWarning",
        id: "171740860308073676111",
      },
      {
        path: "/samplingTask",
        component: "layouts/RouteView",
        route: "1",
        children: [],
        meta: {
          keepAlive: false,
          internalOrExternal: false,
          componentName: "RouteView",
          title: "统计分析",
        },
        name: "StatisticalAnalysis",
        id: "171740860308073676111",
      },
    ],
    meta: {
      keepAlive: false,
      internalOrExternal: false,
      icon: "barcode-outlined",
      componentName: "index",
      title: "投诉管理",
    },
    name: "Complaint",
    id: "1111717402338568945665111",
  },
]);
</script>
<template>
  <div class="w-250px h-full">
    <el-menu
      class="el-menu-vertical h-full"
      :default-active="defaultActive"
      active-text-color="#000"
      background-color="#2D8461"
      text-color="#fff"
      collapse-transition
    >
      <SubMenu :menu="menu" v-for="menu in MenuList" :key="menu.id" />
    </el-menu>
  </div>
</template>
<style lang="scss" scoped></style>
